<template>
    <div class="dv1">{{ obj.message }}</div>
    <div class="dv2">{{ message1 }}</div>
</template>


<script setup>
    import{reactive, ref}from"vue";
    let obj=reactive({message:"不畏浮云遮望眼"});
    let message1 =ref("普通数据");
    setTimeout(()=>{
        obj.message="欲穷千里目，更上一层楼";
        message1.value="新的响应式数据";
    },5000)

</script>

<style scoped>
    .dv1{
        color: yellow;
        font-size: 30px;
        font-weight:bold ;
    }
    .dv2{
        color: rgb(0, 255, 170);
        font-size: 30px;
        font-weight: bold;
    }

</style>